<!DOCTYPE html>
<html>
<head>
<title>通知公告管理</title>
<link href="css/main.css" rel="stylesheet">
</head>
<body>
	<h1>Hello, world!<span id="href"></span></h>
	<div>
		条件：<input id="cond"/>
		status：
		<select id="status" onchange="find();">
			<option value="" selected="selected">= 全部 =</option>
			<option value="0">0状态</option>
			<option value="1">1状态</option>
		</select>
		<button id="btn_find">查找</button>
	</div>
	<div>
		<form name="form" id="form" onsubmit="return false">
			id: <input name="id" id="id"/>
			title:<input name="title" id="title" value="标题1111"/><br/>
			content:<input name="content" id="content" value="内容1111111111"/><br/>
			<button id="btn_add">新增</button>
			<button id="btn_update">保存修改</button>
		</form>
	</div>
	<div id="list"></div>
</body>
</html>
<script src="../../js/jquery.3.2.1.min.js"></script>
<script src="../../js/main.js"></script>
<script>
	//查询
	function find(){
		var all = doHttp('get', '/notice/listByParams', {cond: $('#cond').val(), status: $('#status').val()});
		$('#list').html('');
		//alert(JSON.stringify(all))
		$.each(all, function(i, e) {
			var r = `no_"${i}", id = ${e.id}, status = ${e.status}, title: ${e.title}, content: ${e.content} <input type="button" onclick="toUpdate('${e.id}')" value="编辑"/><input type="button" onclick="toDelete('${e.id}')" value="删除"/><br/>`;
			if(e.status == 1){
				r = `no_"${i}", id: ${e.id}, status: ${e.status}, title: ${e.title}, content: ${e.content} <input type="button" onclick="toUpdate('${e.id}')" value="编辑"/>	<br/>`;
			}
			$('#list').append(r);
		});
	}
	find();
	$("#btn_find").click(function() {
		find();
	});
	
	$("#btn_add").click(function() {
		add();
	});
	$("#btn_update").click(function() {
		update();
	});
	
	function toUpdate(id){
		var url = `/notice/${id}`;
		alert(url);
		var e = doHttp('get', url, {});
		//console.log(JSON.stringify(e));
		alert(JSON.stringify(e));
		$('#id').val(e.id);
		$('#title').val(e.title);
		$('#content').val(e.content);		
	}
	function toDelete(id){
		if(!confirm("删除操作不可恢复，是否继续？")){
			return;
		}
		$.ajax({
			type : 'delete',
			url : '/notice/' + id,
			contentType : "application/json; charset=utf-8",
			success : function(data) {
				alert(data.message);
				if(data.success){
					location.reload();
				}
			},
			//执行异常
			error : function(e) {
				alert(JSON.stringify(e));
			}
		});
	}
	
	function add(){
		//取得表单数据
		var formdata = $("#form").serializeObject();
		console.log(formdata);
		alert("您刚刚输入的数据是：" + JSON.stringify(formdata));
		//添加额外的参数
		formdata.status = 0;
		//alert(formdata.status);
		$.ajax({
			type : 'post',
			url : '/notice',
			contentType : "application/json;charset=utf-8",
			data : JSON.stringify(formdata),
			//执行成功
			success : function(data) {
				alert(data.message);
				if(data.success){
					location.reload();
				}
			},
			//执行异常
			error : function(e) {
				alert(JSON.stringify(e));
			}
		});
	}
	function update(){
		//取得表单数据
		var formdata = $("#form").serializeObject();
		$.ajax({
			type : 'put',
			url : '/notice',
			contentType : "application/json;charset=utf-8",
			data : JSON.stringify(formdata),
			//执行成功
			success : function(data) {
				alert(data.message);
				if(data.success){
					location.reload();
				}
			},
			//执行异常
			error : function(e) {
				alert(JSON.stringify(e));
			}
		});
	}
</script>